<?php echo $this->render('/public/header'); ?>
    <script src="https://cdn.bootcss.com/moment.js/2.22.1/moment.min.js"></script>
    <script src="https://cdn.bootcss.com/iview/2.13.1/iview.min.js"></script>
    <!-- 引入组件库 -->
    <link href="https://cdn.bootcss.com/iview/2.13.1/styles/iview.css" rel="stylesheet">
    <div id="main" class="col-lg-12 col-md-12 col-xs-12">
        <Tabs type="card" @on-click="tabChange">
            <Tab-Pane label="网站询盘">
                <i-table size="small" border :columns="columns1" :data="data1"></i-table>
                <Page :total="10" style="marginTop:10px"></Page>
            </Tab-Pane>
            <Tab-Pane label="网站用户">
                <i-table size="small" border :columns="columns2" :data="data2"></i-table>
                <Page :total="total2" style="marginTop:10px" @on-change="pageChange"></Page>
            </Tab-Pane>
        </Tabs>
    </div>

    <script>
        Vue.use(iview);
        var vm = new Vue({
            el: "#main",
            data: {
                refer: [],
                columns1: [
                    {
                        title: 'id',
                        key: 'id',
                        width: 100
                    },
                    {
                        title: '日期',
                        key: 'time',
                        width: 100,
                        render: (h, params) => {
                            return h('div', moment.unix(params.row.time).format('YYYY-MM-DD'));
                        }
                    },
                    {
                        title: '客户名称',
                        key: 'customer_name',
                        width: 150

                    },
                    {
                        title: '客户编号',
                        key: 'number',
                        width: 150

                    },
                    {
                        title: '客户邮箱',
                        key: 'email',
                        width: 200

                    },
                    {
                        title: '需要数量',
                        key: 'num',
                        width: 100

                    },
                    {
                        title: '详情',
                        key: 'detail',
                    },
                    {
                        title: 'url',
                        key: 'link',
                    }
                ],
                data1: [],
                columns2: [
                    {
                        title: '注册日期',
                        key: 'create_at'
                    },
                    {
                        title: '编号',
                        key: 'number'
                    },
                    {
                        title: '客户名称',
                        key: 'customer_name'
                    },
                    {
                        title: '邮箱',
                        key: 'email'
                    },
                    {
                        title: '邮箱2',
                        key: 'email2'
                    },
                    {
                        title: '当前跟进人'
                    },
                    {
                        title: '客户星级',
                        key: 'customer_star',
                        render: (h, params) => {
                            return h('div', params.row.customer_star + '星')
                        }
                    },
                    {
                        title: '下单次数',
                        key: 'order_times'
                    },
                    {
                        title: '联系电话',
                        key: 'phone'
                    },
                    {
                        title: '客户来源',
                        key: 'refer',
                        render: (h, params) => {
                            let tmp = '';
                            vm.$data.refer.forEach(v => {
                                if (v.id == params.row.refer) {
                                    tmp = v.name;
                                }
                            })
                            return h('div', tmp)
                        }
                    },
                    {
                        title: '推荐人',
                        key: 'new_recommend',
                        render: (h, params) => {
                            const tmp = {
                                s0j0: 'mandy',
                                s0n3: 'mike',
                                s0e1: 'jamie'
                            };
                            return h('div', tmp[params.row.new_recommend]);
                        }
                    },
                    {
                        title: '国家',
                        key: 'country',
                        render: (h, params) => {
                            const tmp = {
                                1: 'USA',
                                2: 'UK',
                                3: 'Canada',
                                4: 'American Samoa',
                                5: 'Germany',
                                6: 'Others'
                            };
                            return h('div', tmp[params.row.country])
                        }
                    },
                    {
                        title: '客户备注',
                        key: 'customer_remark'
                    },
                    {
                        title: 'skype',
                        key: 'skype'
                    },
                    {
                        title: 'whatsapp',
                        key: 'whatsapp'
                    },
                    {
                        title: 'wechat',
                        key: 'wechat'
                    }
                ],
                data2: [],
                total2: 0
            },
            created: function () {
                $.get('/api/customer/customer-base', res => {
                    this.refer = res.refer;
                }, 'json');
                $.get('/api/setting/inquiry2-list', (res) => {
                    this.data1 = res.list;
                }, 'json')
            },
            methods: {
                tabChange: function (v) {
                    if (v == 1) {
                        $.get('/api/customer/list?from_website=2', (res) => {
                            this.data2 = res.list;
                            this.total2 = parseInt(res.total, 10);
                        }, 'json')
                    }
                },

                pageChange: function (v) {
                    const url = '/api/customer/list?from_website=2&p=' + v;
                    $.get(url, (res) => {
                        this.data2 = res.list;
                        this.total2 = parseInt(res.total, 10);
                    }, 'json')
                }
            }

        });
    </script>
<?php echo $this->render('/public/footer'); ?>